/*
 * This file is part of the IoT Management Service
 * Copyright 2019 Canonical Ltd.
 *
 * This program is free software: you can redistribute it and/or modify it
 * under the terms of the GNU Affero General Public License version 3, as
 * published by the Free Software Foundation.
 *
 * This program is distributed in the hope that it will be useful, but WITHOUT
 * ANY WARRANTY; without even the implied warranties of MERCHANTABILITY,
 * SATISFACTORY QUALITY, or FITNESS FOR A PARTICULAR PURPOSE.
 * See the GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */

// Main theme changes
$color-brand: #5C80BC;
$color-link: #005573;

$button-text-color: #f7f7f7;


@import 'node_modules/vanilla-framework/scss/build';

/* no pesky blue border on buttons */
button:focus {
    outline:none !important;
}

[type=date], [type=datetime-local], [type=datetime], [type=email], [type=month], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=time], [type=url], [type=week], select, textarea {
    line-height: 1rem;
}

* {font-family: Helvetica, Arial, sans-serif !important;}
.fa, .far, .fas {
    font-family: "Font Awesome 5 Free" !important;
}
.snapcraft-banner-background {
    background: #DEEFF2;
}
.p-button--positive {
    background: #5C80BC; border: 1px solid #4367A3;
}

.p-button--positive:hover {
    background: #4367A3; border: 1px solid #4367A3;
}

.p-button--neutral.xsmall {
    padding-left: .5rem;
    padding-right: .5rem;
}
      

.page-content {
    font-size: 14px;
}

.p-navigation--dark {
    background-color: #5C80BC;
    color: #fff;
}

.p-navigation a, .p-navigation a:focus, .p-navigation a:hover, .p-navigation a:visited, .p-navigation .p-navigation__link>a {
    color: #f7f7f7 !important;
    font-size: 16px;
    text-decoration: none;
}

.p-navigation a:hover {
    background-color: #2b2b2b;
}

.nav_logo a:hover {
    background-color: initial;
}

.p-navigation__link.active {
    background-color: #4367a2;
}

.p-navigation h3 {
    margin: 0;
}

.spacer {
    margin-top: 1em;
}

.tight {
    margin-bottom: 0;
}

.subnav {
    margin-top: 0;
}

.subnav a {
    font-size: .875rem;
}

.subnav li.p-navigation__link.active {
    background-color: #fff;
    border-bottom: 4px solid $color-link;
}

.subtitle {
    color: $color-mid-dark;
    font-size: 1.22176rem;
}

footer {
    border-top: 1px solid $color-mid-light;
    margin-top: 1em;
}

footer div {
	padding-left: 10px;
}

.p-search-box .p-search-box__button {
    margin-top: 0;
}

button.small, a.p-button--neutral.small, a.p-button--brand.small {
    padding: 0.75rem 0.75rem;
    font-size: 0.9rem;
}

button+button {
    margin-left: 0.5rem;
}

table {
	table-layout: fixed;
}

table th.small, table td.small {
	width: 20%;
}

table th.xsmall, table td.xsmall {
	width: 10%;
}

table td.wrap {
	word-wrap: break-word;
}

table td.overflow {
    text-overflow: ellipsis;
    overflow: hidden;
}

tbody tr.borderless {
    border-bottom: none;
}

.hide {
    display: none;
}

form#account-form {
    border-left: 1px solid #cdcdcd;
    background-color: #4367a2;
}

form#account-form select {
    background-color: transparent;
    border: 0;
    margin-top: .7rem;
    color: #fff;
    font-size: 1.0rem;
    background-position-x: right;
}

form#account-form option {
    background-color: #2C001E;
}

.led-red {
    color: #F00;
}
.led-orange {
    color: #ff8a22;
}
.led-green {
    color: rgb(48, 94, 3);
}
